<template>
  <cfg-table :ref="ref"
    :config="config" 
    :loading="loading" 
    :data="data" 
    :columns="columns" 
    :additionalAction="additionalAction" 
    :pageSizeOpts="pageSizeOpts" 
    :pageNavigation="pageNavigation" 
    :queryFormItem="queryFormItem" 
    :collapseFormItem="collapseFormItem" 
    :btnShowFun="btnShowFun" 
    :rowbgc="rowbgc"
    @loadPage="loadPage"
    @handleEdit="handleEdit"
    @handleDelete="handleDelete"
    @handleDetail="handleDetail"
    @handleClick="handleClick"
    @handleDbClick="handleDbClick"
    @handleCreate="handleCreate"
    @handleDeleteMultiple="handleDeleteMultiple"
    @handleSearch="handleSearch"
    @handleReset="handleReset"></cfg-table>
</template>

<script>
export default {
  name:'pg-table',
  components: {},
  inject:['anc'],
  data() {
    return {
      ref:'table',
      loading:false,
      model:'entity',
      clz:null,
      clzs:null,
    };
  },
  props: {
    data:{
      default:()=>{
        return []
      }
    }
  },
  watch: {},
  computed: {
    config(){
      return {
          search:true,
          addButton:true,
          batchDeleteButton:true,
          downloadIcon:true,
          uploadIcon:true,
          uploadUrl:'/',
          tableSizeIcon:true,
          fullscreenIcon:true,
          refreshIcon:true,
          columnSettingIcon:true,
          checkColumnDisabled:true,
          action:true,
          additionalAction:true
      }
    },
    columns(){
      return [
          {
            key: 'type',
            title: '所属类型',
            minWidth: 100,
            align: 'center',
            show: true
          },
          {
            key: 'className',
            title: '模型类名',
            minWidth: 100,
            align: 'center',
            show: true
          },
      ]
    },
    additionalAction(){
      return {
          key: 'additionalAction',
          title: 'additionalAction',
          slot: 'additionalAction',
          width: 200,
          fixed:'right',
          align: 'center',
          show: true,
          buttons:[
            {title: 'abc',color:'red', event: (row, index) => console.log(row)},
            {title: 'abc2', event: (row, index) => console.log(row)}
          ]
      }
    },
    pageSizeOpts(){
      return [10, 30, 50, 100];
    },
    pageNavigation(){
        return { total: 0, pageSize: 10, pageNumber: 1 };
    },
    queryFormItem(){
        return [
            /*{title:'abc1',key:'abc1',config:{type:'preText',prepend:'abc_'}},
            {title:'abc2',key:'abc2',config:{type:'text'}},
            {title:'abc3',key:'abc3',config:{type:'text'}},
            {title:'abc4',key:'abc4',config:{type:'text'}},
            {title:'abc5',key:'abc5',config:{type:'text'}},
            {title:'abc6',key:'abc6',config:{type:'text'}},
            {title:'abc7',key:'abc7',config:{type:'text'}},
            {title:'abc',key:'any',config:{type:'select'}},*/
        ];
    },
    collapseFormItem(){
        return [
          /*{title:'abc1',key:'any1',config:{type:'select'}},
          {title:'abc2',key:'any1',config:{type:'select'}},*/
        ];
    },
    btnShowFun(){
        return function(){
          return true
        }
    },
    rowbgc(){
        return 'red'
    },
  },
  created() {
    
  },
  mounted() {
    this.$nextTick(()=>{
      this.$set(this.anc.vms,this.ref, this);
    })
  },
  methods: {
    loadPage(pageNavigation,filter){
      
    },
    handleEdit(row,index){

    },
    handleDelete(row,index){

    },
    handleDetail(row,index){

    },
    handleClick(row,index){

    },
    handleDbClick(row,index){

    },
    handleCreate(){

    },
    handleDeleteMultiple(selection){

    },
    handleReset(){

    },
    handleSearch(filter){

    },
  }
};
</script>
<style scoped>
</style>